<!DOCTYPE html>
<html lang="en">
<head>
    <title>集团大区拜访</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-store, must-revalidate">
    <meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT">
    <meta http-equiv="expires" content="-1">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
          name="viewport">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="/dist/img/icon.png" type="image/x-icon">
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="/dist/plugins/bootstrap/css/bootstrap.min.css">
    <!--字体-->
    <link rel="stylesheet" href="/dist/css/font-awesome.min.css">
    <!--图标-->
    <link rel="stylesheet" href="/dist/css/ionicons.min.css">
    <!--OA主样式-->
    <link rel="stylesheet" href="/dist/css/OA.min.css?t=4a6c1b54">
    <link rel="stylesheet" href="/dist/css/skins/OA-skins.min.css?t=16f1e6f3">
    <script src="https://file.ggxqce.com/web/vue.min.js"></script>
    <style>
        [v-cloak] {
            display: none;
        }

        .reginTd {
            max-width: 105px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            position: relative;
        }

        * {
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            font-size: 12px;
        }

        body {
            margin: 1px;
            background: #f8f8f8;
        }

        table {
            border-spacing: 1px;
            border-collapse: collapse;
            display: table;
        }

        table.text-center, table.text-center td, table.text-center th {
            text-align: center;
            font-size: 12px;
        }

        .table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td {
            border: 1px solid #cbcbcd;
            font-weight: normal;
            height: 24px;
        }

        .table th {
            background: yellow;
        }

        .table-bordered {
            border: 1px solid #cbcbcd;
        }

        .table {
            width: 100%;
            max-width: 100%;
        }

        .hidden {
            display: none;
        }

        .lineOne {
            text-align: left;
        }

        .lineOne span {
            max-height: 24px;
            line-height: 24px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
            text-align: left;
        }

        .mScrollBox {
            float: left;
            position: relative;
            overflow: hidden;
        }

        .toggleDiv div {
            width: 50%;
            float: left;
            text-align: center;
        }

        .toggleDiv div.active {
            border-bottom: 2px solid #2289ee;
        }

        .div-td-content-more {
            position: absolute;
            height: auto;
            z-index: 999;
            line-height: 20px;
            background-color: #d3e8fd;
            padding: 8px 6px;
            border: 1px solid #e8e8ea;
            display: none;
        }

        .div-td-content-more i {
            width: 15px;
            height: 12px;
            background: url("/dist/img/more-icon.png");
            position: absolute;
            left: 50px;
            top: -12px;
        }
    </style>
</head>
<body>
<section id="app" v-cloak>
    <div class="div-td-content-more"><i></i></div>

    <div style="margin-top: 10px;" id="daQuVisitGroup">
        <div style="width: 100%;" class="mScrollBox">
            <table class="table table-bordered text-center table-width">
                <thead>
                <tr>
                    <!--<th style="width: 5%">序号</th>-->
                    <th style="width: 20%;text-align: center">公司</th>
                    <th style="width:15%;text-align: center">总经理<br/>销售总监</th>
                    <th style="width:15%;;text-align: center">
                        大区经理<br/>数量
                    </th>
                    <th style="width:15%;text-align: center">
                        陪跑区域<br/>经理数量
                    </th>
                    <th style="width:15%;text-align: center">
                        拜访客户<br/>数量
                    </th>
                </tr>
                </thead>
                <tbody>
                <template v-if="daQuVisitGroup.list.length>0">
                    <tr v-for="(item,i) in daQuVisitGroup.list">
                        <td style="text-align: center">{{item.companyName}}</td>
                        <td>
                            <span v-if="item.managerName">{{item.managerName}}</span>
                            <span v-else-if="item.salerManagerName">{{item.salerManagerName}}</span>
                            <span v-else style="color: #CCCCCC;">空缺</span>
                        </td>
                        <td style="text-align: center">
                            {{item.bigRegionManagerNum==''?'-':item.bigRegionManagerNum}}
                        </td>
                        <td style="text-align: center">
                            {{item.managerCount==''?'-':item.managerCount}}
                        </td>
                        <td v-if="item.customerCount==''||item.customerCount=='-'">-</td>
                        <td v-else @click="openDaQuCompany(item)"
                            style="color:#169BD5;cursor: pointer">{{item.customerCount}}
                        </td>
                    </tr>
                    <tr>
                        <td>合计</td>
                        <td>-</td>
                        <td>{{daQuVisitGroup.bigRegionManagerNum}}</td>
                        <td>{{daQuVisitGroup.managerCount}}</td>
                        <td>{{daQuVisitGroup.customerCount}}</td>
                    </tr>
                </template>
                <template v-else>
                    <tr>
                        <td colspan="5">暂无数据</td>
                    </tr>
                </template>
                </tbody>
            </table>
        </div>
        <div class="clearfix"></div>
    </div>

    <!-- /.box-body -->
</section>
<!--JQ-->
<script src="https://file.ggxqce.com/web/jquery-2.2.3.min.js"></script>
<!--插件JS-->
<script src="https://file.ggxqce.com/web/bootstrap.min.js"></script>
<script src="/dist/plugins/scroll/myScroll.js"></script>

<!--oa自定义  JS-->
<script src="/dist/js/oaApp.js"></script>
<script>
    $(function () {
        $("body").on("click", ".lineOne,.lineTwo", function (e) {
            if ($(".div-td-content-more").is(":hidden")) {
                var text = $(this).text();
                if (text != "") {
                    text = "<i></i>" + text;
                    $(".div-td-content-more").html(text).css({
                        "width": $(this).outerWidth() + 80 + "px",
                        "left": $(this).offset().left - 6,
                        "top": ($(this).offset().top + $(this).outerHeight()) + "px"
                    }).show();
                    e.stopPropagation();
                }
            } else {
                $(".div-td-content-more").hide();
            }
        });
        $("body").on("click", ".div-td-content-more", function (e) {
            e.stopPropagation();
        });
        $("body").on("click", function () {
            $(".div-td-content-more").hide();
        });
    });
</script>
<script type="text/javascript">
    $(function () {
        $("body").on("click", ".reginTd", function (e) {
            var text = $(this).text();
            if (text != "") {
                text = "<i></i>" + text;
                $(".div-td-content-more").html(text).css({
                    "width": $(this).outerWidth() + "px",
                    "left": $(this).offset().left,
                    "top": ($(this).offset().top + $(this).outerHeight()) + "px"
                }).show();
                e.stopPropagation();
            }
        });
        $("body").on("click", ".div-td-content-more", function (e) {
            e.stopPropagation();
        });
        $("body").on("click", function () {
            $(".div-td-content-more").hide();
        });

    });

</script>
<script type="text/javascript">
    var app = new Vue({
        el: '#app',
        data: {
            currentUser: getCurrentUser(),
            companyId: getUrlParamObj().companyId,
            userId: getUrlParamObj().userId,
            dateTime: getUrlParamObj().dateTime,
            daQuVisitCompany: {
                time: getUrlParamObj().dateTime,
                faceList: [],
                telList: [],
                allDate: [
                    {"planCount": "", "finishCount": "", "signInNum": "", "errorNum": ""},
                    {"planCount": "", "finishCount": ""}
                ],
            },
            daQuVisitGroup: {
                time: new Date().Format("yyyy-MM-dd"),
                list: [],
                allCount: {"bigRegionManagerNum": "", "customerCount": "", "managerCount": ""}
            },
        },
        methods: {
            isFair: function (item) {
                var str = '';
                if (!this.distanceJq(item.signInDistance) && !this.timeJq(item.signInTimeDiff)) {
                    str = "距离、时间不合理"
                }
                else if (!this.distanceJq(item.signInDistance)) {
                    str = "距离不合理"
                }
                else if (!this.timeJq(item.signInTimeDiff)) {
                    str = "时间不合理"
                }
                return str
            },
            //距离合理->true 不合理->false
            distanceJq: function (d) {
                if (d) {
                    var str = d.replace("公里", "");
                    return Number(str) < 15
                }
            },
            //时间合理->true 不合理->false
            timeJq: function (t) {
                if (t) {
                    if (t.indexOf("小时") > 0) {
                        var hour = t.split("小时")[0];
                        if (Number(hour) > 0) {
                            return false;
                        }
                    } else {
                        if (t.indexOf("分") > 0) {
                            var min = t.split("分")[0];
                            if (Number(min) > 30) {
                                return false;
                            }
                        } else {
                            return true;
                        }
                    }
                }
                return true;
            },
            //距离间隔
            dJq: function (d) {
                if (d) {
                    var str = d.replace("公里", "");
                    console.log("距离间隔 = " + str)
                    if (str == '0') {
                        return '';
                    } else {
                        return Number(str).toFixed(2);
                    }
                }
            },
            //速度
            disJq: function (dis) {
                if (dis) {
                    var str = dis.replace("km/h", "");
                    return str;
                }
            },
            //去秒加0几分
            quMiao: function (m) {
                if (!m) return ""
                //1小时11分11秒
                var hour = "0"
                var min = "0"
                var sec = "0"

                if (m.indexOf("小时") > 0) {
                    //{1  , 11分11秒} 1小时55秒
                    hour = m.split("小时")[0]
                }
                if (m.indexOf("分") > 0) {
                    //{1小时11，11秒}
                    min = m.split("分")[0]
                    if (min.indexOf("小时") > 0) {
                        //{1,11}
                        min = min.split("小时")[1]
                    }
                    if (Number(min) < 10) {
                        min = "0" + min
                    }
                }
                if (min == "0" && m.indexOf("秒") > 0) {
                    //21秒
                    return hour + "小时01分"
                }
                return hour + "小时" + min + "分"
            },
            //添加0小时xx分
            addZeroHour: function (h) {
                if (!h) {
                    return ""
                }
                if (h.indexOf('小时') > 0) {
                    return h
                } else {
                    return "0小时" + h
                }
            },
            isHasRightOp: function (regionId) {
//                console.log($.inArray(regionId, this.reginIds) > -1)
                return $.inArray(regionId, this.reginIds) > -1;
            },
            isGo: function (item) {
                var that = this;
                if (that.isHasRightOp(item.regionId)) {
                    return true
                } else {
                    return false
                }
            },
            //获取合计
            getCount: function (arr, key) {
                var number = 0;
                for (var i = arr.length - 1; i >= 0; i--) {
                    number += (arr[i][key] && arr[i][key] != '-' ? Number(arr[i][key]) : 0)

                }
                return number;
            },
            lookPersonnelDepartList: function (item) {
                top.addTabs({
                    id: "look" + item.id,
                    title: item.managerName + "详情",
                    close: true,
                    url: '/personnel/entry.html?id=' + item.userId + '&pageType=look'
                });
            },
            getAll: function (arr, type) {
                if (type == "1") {
                    this.daQuVisitCompany.allDate[1].planCount = this.getCount(arr, "planCount");
                    this.daQuVisitCompany.allDate[1].finishCount = this.getCount(arr, "finishCount");
                    this.daQuVisitCompany.allDate[1].signInNum = this.getCount(arr, "signInNum");
                    this.daQuVisitCompany.allDate[1].errorNum = this.getCount(arr, "errorNum");
                    this.daQuVisitCompany.allDate[1].averageComplete = (this.daQuVisitCompany.allDate[1].finishCount / this.daQuVisitCompany.allDate[1].signInNum).toFixed(2);

                } else {
                    this.daQuVisitCompany.allDate[0].finishCount = this.getCount(arr, "finishCount");
                    this.daQuVisitCompany.allDate[0].signInNum = this.getCount(arr, "signInNum");
                    this.daQuVisitCompany.allDate[0].averageComplete = (this.daQuVisitCompany.allDate[0].finishCount / this.daQuVisitCompany.allDate[0].signInNum).toFixed(2);
                }
            },
            getRegionByUserId: function () {
                var that = this;
                $.wyui.postMethod(urlConfig.report.daQuVisitCompany.getRegionByUserId, {userId: getCurrentUser().id}, function (ids) {
                    for (var i = 0; i < ids.length; i++) {
                        that.reginIds.push(ids[i].regionId);
                    }
//                    console.log(that.reginIds)
                }, true);
            },
            //获取拜访报表-区域经理
            get_daQuVisitCompany: function () {
                var that = this;
                $.wyui.postMethod(urlConfig.report.visitCustomer.getBigRegionManagerVisitForDepart, {
                    "companyId": that.companyId,
                    "userId": that.userId,
                    "dateTime": that.daQuVisitCompany.time,
                    "visitType": "1"
                }, function (data) {
                    console.log(data)
                    var data = trimRN2(data);
                    that.daQuVisitCompany.faceList = data;
                    that.getAll(that.daQuVisitCompany.faceList, "1");
                }, false, "#daQuVisitCompany")
                $.wyui.postMethod(urlConfig.report.visitCustomer.getBigRegionManagerVisitForDepart, {
                    "companyId": that.companyId,
                    "userId": that.userId,
                    "dateTime": that.daQuVisitCompany.time,
                    "visitType": "0"
                }, function (data) {
                    var data = trimRN2(data);
                    that.daQuVisitCompany.telList = data;
                    that.getAll(that.daQuVisitCompany.faceList, "0");
                }, false, "#daQuVisitCompany")
            },
            getRegionNameByUserId: function () {
                var that = this;
                $.wyui.postMethod(urlConfig.report.daQuVisitCompany.getForDepartByUserIdForClick, {userId: getCurrentUser().id}, function (ids) {
                    for (var i = 0; i < ids.length; i++) {
                        that.regionNames.push(ids[i].regionName);
                    }
                }, true);
            },
            openDaQuCompany: function (item) {
                var that = this;
                var obj = {
                    type: 'company',
                    url: '/reportForm/interview/daQuInterviewCompanyApp.html?companyId=%1s&companyName=%2s&dateTime=%3s',
                    id: item.companyId,
                    name: item.companyName,
                    dateTime: that.dateTime
                }
                prompt(JSON.stringify(obj))
            },
            openPlan: function (item) {
                console.log(item)
                url = "reportForm/interview/daQuPlan.html"
                top.closeTabByPageId("dqbf-company1");
                top.addTabs({
                    id: "dqbf-company1",
                    title: "面访计划",
                    close: true,
                    url: url + '?userId=' + item.userId + "&dateTime=" + this.daQuVisitCompany.time,
                });
            },
            openInterview: function (item, type) {
                console.log(item)
                var that = this;
                top.closeTabByPageId("khList2");
                top.addTabs({
                    id: 'khList2',
                    title: type == 1 ? item.name + '面访' : item.name + '电访',
                    close: true,
                    url: 'reportForm/interview/daQuinterviewCustomerList.html?userId=' + item.userId + "&dateTime=" + that.daQuVisitCompany.time + "&name=" + item.name + "&type=" + type,
                });
            },
//            openAbnormal
            openAbnormal: function (item) {
                var that = this;
                top.closeTabByPageId("interviewYc");
                top.addTabs({
                    id: 'interviewYc',
                    title: '本月面访详情',
                    close: true,
                    url: 'reportForm/interview/interviewAbnormal.html?userId=' + item.userId + "&dateTime=" + that.daQuVisitCompany.time + '&managerName=' + item.managerName,
                });
            },
            //大区拜访-集团级别
            get_daQuVisitGroup: function () {
                var that = this;
                var param = {
                    "userId": that.userId,
                    "dateTime": that.dateTime,
                }
                $.ajax({
                    url: server.ip + urlConfig.report.visitCustomer.getBigRegionManagerVisitForGroup,
                    contentType: 'application/json;charset=utf-8',
                    type: "POST",
                    data: JSON.stringify(param),
                    success: function (r) {
                        var res = JSON.parse(r);
                        var sendData = res.data.sendData
                        var data = trimRN2(sendData)
                        that.daQuVisitGroup.list = data;
                        //获取合计
                        that.daQuVisitGroup.bigRegionManagerNum = that.getCount(that.daQuVisitGroup.list, "bigRegionManagerNum");
                        that.daQuVisitGroup.managerCount = that.getCount(that.daQuVisitGroup.list, "managerCount");
                        that.daQuVisitGroup.customerCount = that.getCount(that.daQuVisitGroup.list, "customerCount");
                    },
                    error: function (e) {
                        alert(e.responseText)
                    }
                })
            },
        },
        mounted: function () {
            var that = this;
            that.get_daQuVisitGroup();
        }

    });
</script>
</body>
</html>